﻿
@section styles{
    <environment names="Development">
        <link href="~/lib/jquery-datatable/skin/bootstrap/css/dataTables.bootstrap.css" rel="stylesheet" asp-append-version="true" />
        <link href="~/lib/bootstrap-select/css/bootstrap-select.css" rel="stylesheet" asp-append-version="true" />
    </environment>
    <environment names="Staging,Production">
        <link href="~/lib/jquery-datatable/skin/bootstrap/css/dataTables.bootstrap.min.css" rel="stylesheet" asp-append-version="true" />
        <link href="~/lib/bootstrap-select/css/bootstrap-select.min.css" rel="stylesheet" asp-append-version="true" />
    </environment>
    <style type="text/css">
        td {
            word-break: break-all;
        }

            td i {
                cursor: pointer;
            }

        .logWarnning {
            color: #ff9800;
        }

        .logError {
            color: red;
        }
    </style>
}

<div id="logView" class="container-fluid">
    <!-- Tasks -->
    <div class="row clearfix">
        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
            <div class="card">
                <div class="header">
                    <h2>
                        RUNNING LOGS: &nbsp;<span v-text="taskName + ' ' + identity"></span>
                    </h2>
                </div>
                <div class="body">
                    <div class="row" style="margin-left:10px; margin-bottom:10px;">
                        <input name="logType" type="radio" id="All" value="All" v-model="logType" @@click="searchResults('All')" />
                        <label for="All">All</label>
                        <input name="logType" type="radio" id="Info" value="Info" v-model="logType" @@click="searchResults('Info')" />
                        <label for="Info">Info</label>
                        <input name="logType" type="radio" id="Warn" value="Warn" v-model="logType" @@click="searchResults('Warn')" />
                        <label for="Warn">Warn</label>
                        <input name="logType" type="radio" id="Error" value="Error" v-model="logType" @@click="searchResults('Error')" />
                        <label for="Error">Error</label>
                    </div>
                    <div class="dataTables_wrapper form-inline dt-bootstrap">
                        <div id="tasksVIEW" class="dataTables_wrapper form-inline dt-bootstrap no-footer">
                            <div class="table-responsive">
                                <table class="table table-bordered table-striped table-hover no-footer">
                                    <thead>
                                        <tr role="row">
                                            <th>NodeId</th>
                                            <th>Logged</th>
                                            <th>Level</th>
                                            <th>Message</th>
                                            <th>Exception</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr v-show="logs.length==0">
                                            <td colspan="13">
                                                No data to display...
                                            </td>
                                        </tr>
                                        <tr role="row" v-for="(log,index) in logs">
                                            <td><span v-text="log.nodeId"></span></td>
                                            <td><span v-text="log.logged"></span></td>
                                            <td><span v-text="log.level"></span></td>
                                            <td><span v-text="log.message"></span></td>
                                            <td><span v-text="log.exception"></span></td>
                                        </tr>
                                    </tbody>
                                </table>

                                <div v-show="logs.length>0" class="dataTables_info">Showing <span v-text="page"></span> to <span v-text="size"></span> of <span v-text="total"></span> entries</div>
                                <div v-show="logs.length>0" class="dataTables_paginate paging_simple_numbers" id="pagination">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- #END# Tasks -->
</div>

@section scripts{
    <environment names="Development">
        <script src="~/lib/jquery-datatable/jquery.dataTables.js" asp-append-version="true"></script>
        <script src="~/lib/jquery-datatable/skin/bootstrap/js/dataTables.bootstrap.js" asp-append-version="true"></script>
        <script src="~/lib/bootstrap-select/js/bootstrap-select.js" asp-append-version="true"></script>
        <script src="~/js/taskLog/index.js" asp-append-version="true"></script>
    </environment>
    <environment names="Staging,Production">
        <script src="~/lib/jquery-datatable/jquery.dataTables.js" asp-append-version="true"></script>
        <script src="~/lib/jquery-datatable/skin/bootstrap/js/dataTables.bootstrap.min.js" asp-append-version="true"></script>
        <script src="~/lib/bootstrap-select/js/bootstrap-select.min.js" asp-append-version="true"></script>
        <script src="~/js/taskLog/index.min.js" asp-append-version="true"></script>
    </environment>
    <script src="~/lib/My97DatePicker/WdatePicker.js" asp-append-version="true"></script>
}